<template>
  <div class='pagebox'>
    <crumbs @goBack='() => {}' :superiorMenu="['生产管理']" currentMenu='生产工单' style='margin-bottom: 12px'></crumbs>
    <a-card :bordered='false' size='small' style='height: 100%'>
      <div class='topBox'>
        <div>
          <a-button @click='handleShowFilter' icon='filter' style='margin-right: 10px'>
            筛选 <span style='color: #1890ff; margin-left: 5px'>{{ filteredNums }}</span></a-button
          >
          <a-button @click='showColumn' icon='unordered-list' style='margin-right: 10px'> 设置列</a-button>
        </div>
        <div class='right-btn'>
          <PubExport
            :exportUrl='exportUrl'
            :columns='columns'
            :propForm='formatData()'
            :selectedRows='chooseArr'
            :sortForm='sortForm'
            :fullName='fullName'
            v-if="hasButton('productOrder:derived')"
          />

          <a-button type='primary' style='margin-left: 10px' @click='newBuild' v-if="hasButton('productOrder:add')">
            +新建
          </a-button>
        </div>
      </div>

      <a-table
        v-if='tableShow'
        :key='tableKey'
        row-key='id'
        :columns='columns'
        size='middle'
        :data-source='tableData'
        :pagination='false'
        :scroll="{ x: computedX, y: 'calc(100vh - 300px)' }"
        :row-selection="{
          selectedRowKeys: selectedRowKeys,
          columnTitle: ' ',
          onChange: onSelectChange,
        }"
        @change='tableChange'
        :components="drag(columns, 'WORK_ORDER_LIST')"
      >
        <!-- 输入框搜索 -->
        <div slot='searchDropdown' slot-scope='{ confirm, clearFilters, column }' class='searchWorkOreder'>
          <a-input
            :placeholder='checkPlaceholder(column.dataIndex)'
            v-model='filterForm[column.dataIndex]'
            style='width: 188px; display: block'
          />
          <a-button
            type='primary'
            style='width: 80px; margin-left: 20px; display: block'
            @click='() => pubSearch(confirm, column.dataIndex, clearFilters)'
          >
            搜索
          </a-button>
        </div>
        <a-icon
          slot='searchIcon'
          slot-scope='filtered'
          type='search'
          :style="{ color: filtered ? '#108ee9' : undefined }"
        />
        <!-- 选择搜索 -->
        <div slot='selectDropdown' slot-scope='{ confirm, clearFilters, column }' class='searchWorkOreder'>
          <a-select
            mode='multiple'
            :placeholder='checkPlaceholder(column.dataIndex)'
            style='width: 200px'
            v-model='filterForm[column.dataIndex]'
          >
            <a-select-option v-for='item in statusList' :key='item.value' :value='item.value'>
              {{ item.label }}
            </a-select-option>
          </a-select>
          <a-button
            type='primary'
            style='width: 80px; margin-left: 20px; display: block'
            @click='() => pubSearch(confirm, column.dataIndex, clearFilters)'
          >
            搜索
          </a-button>
        </div>
        <a-icon
          slot='selectIcon'
          slot-scope='filtered'
          type='filter'
          :style="{ color: filtered ? '#108ee9' : undefined }"
        />
        <!-- 人员选择 -->
        <div slot='selectPeople' slot-scope='{ confirm, clearFilters, column }' class='searchWorkOreder'>
          <j-select-user-by-dep
            @changeRow='userPrinc'
            v-model='principalStr'
            :seldep='true'
            :modalWidth='1000'
            :limit='5'
            :multi='true'
            v-if="column.dataIndex == 'updateByText'"
          >
          </j-select-user-by-dep>
          <j-select-user-by-dep
            @changeRow='userCreate'
            v-model='createStr'
            :seldep='true'
            :modalWidth='1000'
            :limit='5'
            :multi='true'
            v-if="column.dataIndex == 'createByText'"
          ></j-select-user-by-dep>
          <a-button
            type='primary'
            style='width: 80px; margin-left: 20px; display: block'
            @click='() => handleSearch(confirm, column.dataIndex, clearFilters)'
          >
            搜索
          </a-button>
        </div>
        <a-icon
          slot='peopleIcon'
          slot-scope='filtered'
          type='search'
          :style="{ color: filtered ? '#108ee9' : undefined }"
        />
        <!-- 插槽显示 -->
        <span
          slot='orderCode'
          @click='openDetail(record)'
          slot-scope='text, record'
          style='color: #1890ff; cursor: pointer'
          :title='text'
        >{{ text }}</span
        >
        <span slot='num' slot-scope='text, record' :title="text ? numFormat(record.num) : '0'">{{
            text ? numFormat(record.num) : '0'
          }}</span>
        <span slot='producedNum' slot-scope='text, record' :title="text ? numFormat(record.num) : '0'">{{
            text ? numFormat(record.producedNum) : '0'
          }}</span>
        <span slot='goodsName' slot-scope='text, record' :title='record.goodsName'>{{ record.goodsName }}</span>
        <div style='display: flex;' slot='orderStatusList' slot-scope='text, record'>
          <div style='padding: 0 20px' v-for='(item, index) in record.produceOrderTaskVo' :key='index'>
            <div>
              <div style='display: flex;flex-direction: column;margin: 0px 10px;align-items: center;'>
                <a-progress
                  type='circle'
                  :percent='(item.qualifiedNum / item.planProduceNum) * 100'
                  :strokeWidth='6'
                  :showInfo='true'
                  :format='(_)=>progressFormat(_,item.qualifiedNum,item.planProduceNum)'
                  :width='40'
                  status='normal'
                  :strokeColor='checkStatus((item.qualifiedNum / item.planProduceNum) * 100)'
                />
                <span>{{ item.processesName || '-' }}</span>
              </div>
            </div>
          </div>
        </div>

        <span
          slot='planStartTime'
          :title="text ? moment(text).format('YYYY-MM-DD HH:mm') : '-'"
          slot-scope='text, record'
        >{{ moment(record.planStartTime).format('YYYY-MM-DD HH:mm') }}</span
        >
        <span
          slot='planEndTime'
          :title="text ? moment(text).format('YYYY-MM-DD HH:mm') : '-'"
          slot-scope='text, record'
          :style='{ color: checkColor(record) }'
        >{{ moment(record.planEndTime).format('YYYY-MM-DD HH:mm') }}</span
        >
        <span slot='orderStatusText' slot-scope='text, record'>
          <span v-if="record.orderStatus == '0'" style='color: #ff943e' :title="record.orderStatusText || '-'">{{
              record.orderStatusText || '-'
            }}</span>
          <span v-if="record.orderStatus == '1'" style='color: #1890ff' :title="record.orderStatusText || '-'">{{
              record.orderStatusText || '-'
            }}</span>
          <span v-if="record.orderStatus == '2'" style='color: #00b042' :title="record.orderStatusText || '-'">{{
              record.orderStatusText || '-'
            }}</span>
          <span v-if="record.orderStatus == '3'" style='color: #888888' :title="record.orderStatusText || '-'">{{
              record.orderStatusText || '-'
            }}</span>
        </span>
        <!-- 操作 -->
        <span slot='actions' slot-scope='text, record'>
          <a @click='editForm(record)' v-if="hasButton('productOrder:edit')">编辑</a>
          <span>
            <a-divider type='vertical'
                       v-if="
                       hasButton('productOrder:edit') &&
              (hasButton('productOrder:start')
              || hasButton('productOrder:completed')
              || hasButton('productOrder:copy')
              || hasButton('productOrder:cancel')
              || hasButton('productOrder:delete')
              || hasButton('productOrder:back')
              || hasButton('productOrder:print'))"
            />
            <a-dropdown>
              <a class='ant-dropdown-link' v-if="
              hasButton('productOrder:start')
              || hasButton('productOrder:completed')
              || hasButton('productOrder:copy')
              || hasButton('productOrder:cancel')
              || hasButton('productOrder:delete')
              || hasButton('productOrder:back')
              || hasButton('productOrder:print')">
                更多
                <a-icon type='down' />
              </a>
              <a-menu slot='overlay'>
                <a-menu-item>
                  <a-popconfirm
                    v-if="record.orderStatus == '0'"
                    title='请确定要开始此工单吗?'
                    @confirm='confirmStart(record)'
                    ok-text='确定'
                    cancel-text='取消'
                  >
                    <div><a-button type='link' v-if="hasButton('productOrder:start')">开始 </a-button></div>
                  </a-popconfirm>
                </a-menu-item>
                <a-menu-item>
                  <a-button @click='overItem(record)'
                            v-if="record.orderStatus == '1' && hasButton('productOrder:completed')"
                            type='link'>完成 </a-button>
                </a-menu-item>
                <a-menu-item>
                  <a-button @click='copyForm(record)' type='link' v-if="hasButton('productOrder:copy')">复制 </a-button>
                </a-menu-item>
                <a-menu-item>
                  <a-button
                    @click='cancelord(record)'
                    v-if="(record.orderStatus == '0' || record.orderStatus == '1') && hasButton('productOrder:cancel')"
                    type='link'
                  >取消
                  </a-button>
                </a-menu-item>
                <a-menu-item>
                  <a-button type='link' @click='delconta(record.id)' style='color: red'
                            v-if="hasButton('productOrder:delete')">删除 </a-button>
                </a-menu-item>
                <a-menu-item>
                  <a-button type='link' @click='cancellation(record)'
                            v-if="record.orderStatus != '0' && hasButton('productOrder:back')">撤回 </a-button>
                </a-menu-item>
                <a-menu-item>
                  <a-button type='link' @click='printIt(record, true)'
                            v-if="hasButton('productOrder:print')">打印</a-button>
                </a-menu-item>
              </a-menu>
            </a-dropdown>
          </span>
          <span
            v-if="(record.status == 'abolished' || record.status == 'completed') && hasButton('productOrder:print')">
            <a style='color: #1890ff' @click='printIt(record.id, true)'>打印工单</a>
          </span>
        </span>
      </a-table>
    </a-card>
    <a-modal
      v-if='printvisible'
      :width="currentEnvironment == 'dingding' ? (printType ? 1000 : 800) : 500"
      :visible='printvisible'
      :closable='false'
      :confirm-loading='false'
      @cancel='printvisible = false'
      title='打印'
    >
      <dingPrintView v-if="currentEnvironment == 'dingding' && printType" :id='printId' />
      <dingProcessView v-if="currentEnvironment == 'dingding' && !printType" :id='printId' />

      <!-- <a-form-model-item> -->
      <div style='text-align: center; width: 100%'>
        <a-radio-group v-model='types'>
          <a-radio value='1'>工单流转卡-A4纸</a-radio>
          <a-radio value='2'>生产报工信息卡-A4纸</a-radio>
        </a-radio-group>
      </div>
      <!-- </a-form-model-item> -->
      <div v-if='types == 2'>
        <a-form-model :model='prinForm' :rules='prinFormrulus' ref='prinForm'>
          <a-row>
            <a-col :span='24'>
              <a-form-model-item prop='title' label='标题'>
                <a-input v-model='prinForm.title' placeholder='请输入' />
              </a-form-model-item>
            </a-col>
            <a-col :span='24'>
              <a-form-model-item prop='title' label='操作人'>
                <j-select-user-by-dep
                  @changeRow='ControlsFun'
                  v-model='prinForm.Controls'
                  :limit='8'
                  :seldep='true'
                  :modalWidth='1000'
                  :multi='true'
                ></j-select-user-by-dep>
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </div>
      <template slot='footer'>
        <a-button key='back' @click='printvisible = false'> 取消</a-button>
        <a-button key='submit' type='primary'>
          <workOrder :row='row' @changePrint='changePrint' v-if="printvisible && types == '1'" />
          <circulationCard
            :id='printId'
            :prinForm='prinForm'
            @changePrint='changePrint'
            v-if='printvisible && types == 2'
          />
        </a-button>
      </template>
    </a-modal>
    <a-modal
      v-if='batchPrintvisible'
      :width="currentEnvironment == 'dingding' ? 1000 : 500"
      :visible='batchPrintvisible'
      :closable='false'
      :confirm-loading='false'
      @cancel='batchPrintvisible = false'
      title='批量打印'
    >
      <batch-ding-print-view v-if="currentEnvironment == 'dingding'" :ids='selectedRowKeys' />
      <div v-if="currentEnvironment != 'dingding'">是否确定批量打印！</div>
      <template slot='footer'>
        <a-button key='back' @click='batchPrintvisible = false'> 取消</a-button>
        <a-button key='submit' type='primary'>
          <batch-work-order :ids='chooseArr' @changePrint='changeBatchPrint' v-if='batchPrintvisible' />
        </a-button>
      </template>
    </a-modal>
    <div class='uni-card pagination-contian' :style="{ left: collapsed ? '197px' : '76px' }">
      <div class='check-contain'>
        <a-checkbox :indeterminate='listIndeterminate' :checked='listCheckAll' @change='onCheckAllChange'></a-checkbox>
        <span class='pubColor' @click='batchStartAction' v-if="hasButton('productOrder:start')">开始</span>
        <span class='pubColor' @click='batchAction()' v-if="hasButton('productOrder:completed')">完成</span>
        <span class='pubColor' @click='quxiaoAction()' v-if="hasButton('productOrder:cancel')">取消</span>
        <span class='pubColor' @click='chehuiAction' v-if="hasButton('productOrder:back')">撤回</span>
        <span class='pubColor' @click='batchPrintAction' v-if="hasButton('productOrder:print')">打印</span>
        <span class='pubColor' @click="delord('batchOver')" v-if="hasButton('productOrder:delete')">删除</span>
        <span style='margin-left: 8px'>
          {{ `已选 ${selectedRowKeys.length}/${total} 条` }}
          <span class='pubColor' @click='clearArr'>清空</span>
        </span>
      </div>
      <div class='page-contain'>
        <a-pagination
          :total='total'
          v-model='current'
          :page-size-options='pageSizeOptions'
          :page-size='pageSize'
          @change='onChangePage'
          @showSizeChange='onShowSizeChange'
          show-quick-jumper
          show-size-changer
        />
      </div>
    </div>
    <SetColumn
      columnName='设置列'
      ref='SetColumn'
      v-if='showSetColumn'
      @sureBtn='sureBtn'
      @cancelBtn='showSetColumn = false'
    />
    <!-- 筛选抽屉 -->
    <a-drawer width='500' :closable='true' :visible='showFilter' @close='closeFilter'>
      <div class='filter-body'>
        <div slot='title' class='uni-card filter-tit'>
          筛选 <span class='filter-num'>{{ filteredNums }}</span>
        </div>
        <div v-if='filteredNums > 0' class='tagContian'>
          <div v-for='(item, i) in filteredList' :key='i' v-show='checkShow(item.text)' class='tag-wrap'>
            <span class='filter-tag' @click='delFiltered(item.key)'>
              <span class='tag-text'>{{ `${item.title}：${item.text}` }}</span>
              <a-icon type='close' style='float: right' />
            </span>
          </div>
        </div>
        <div style='overflow-y: scroll; flex: 1; padding: 0'>
          <div class='uni-card' style='background: #fff'>
            <a-form-model ref='ruleForm' layout='vertical' :model='filterForm'>
              <a-form-model-item label='生产状态'>
                <a-select mode='multiple' placeholder='请选择' v-model='filterForm.orderStatus' allowClear>
                  <a-select-option v-for='items in statusList' :key='items.value' :value='items.value'>
                    {{ items.label }}
                  </a-select-option>
                </a-select>
              </a-form-model-item>
              <a-form-model-item label='工单编号'>
                <a-input v-model='filterForm.orderCode' placeholder='请输入' />
              </a-form-model-item>
              <a-form-model-item label='物品名称'>
                <a-input v-model='filterForm.serialName' placeholder='请输入' :maxLength='30' />
              </a-form-model-item>
              <a-form-model-item label='物品编号'>
                <a-input v-model='filterForm.serialNumber' placeholder='请输入' />
              </a-form-model-item>
              <a-form-model-item label='规格'>
                <a-input v-model='filterForm.serialSpecifications' placeholder='请输入' />
              </a-form-model-item>
              <a-form-model-item label='计划开始时间'>
                <a-range-picker
                  date-format='YYYY-MM-DD'
                  :placeholder="['请输入', '请输入']"
                  v-model='modelStartTime'
                  style='width: 100%'
                  @change='startTimeChange'
                />
              </a-form-model-item>
              <a-form-model-item label='计划完成时间'>
                <a-range-picker
                  date-format='YYYY-MM-DD'
                  :placeholder="['请输入', '请输入']"
                  v-model='modelEndTime'
                  style='width: 100%'
                  @change='endTimeChange'
                />
              </a-form-model-item>
              <a-form-model-item label='更新人'>
                <j-select-user-by-dep
                  @changeRow='principalChange'
                  v-model='principalStr'
                  :seldep='true'
                  :modalWidth='1000'
                  :limit='5'
                  :multi='true'
                >
                </j-select-user-by-dep>
              </a-form-model-item>
              <a-form-model-item label='关联订单'>
                <a-input v-model='filterForm.sellOrderCode' placeholder='请输入' />
              </a-form-model-item>
              <a-form-model-item label='创建人'>
                <j-select-user-by-dep
                  @changeRow='createChange'
                  v-model='createStr'
                  :seldep='true'
                  :modalWidth='1000'
                  :limit='5'
                  :multi='true'
                ></j-select-user-by-dep>
              </a-form-model-item>
              <a-form-model-item label='创建时间'>
                <a-range-picker
                  date-format='YYYY-MM-DD'
                  :placeholder="['请输入', '请输入']"
                  v-model='modelCreateTime'
                  style='width: 100%'
                  @change='timeCreateChange'
                />
              </a-form-model-item>
              <a-form-model-item label='更新时间'>
                <a-range-picker
                  v-model='filterForm.updateTime'
                  date-format='YYYY-MM-DD'
                  :placeholder="['请输入', '请输入']"
                  style='width: 100%'
                  @change='uptime'
                />
              </a-form-model-item>
            </a-form-model>
          </div>
        </div>
        <div class='footer-submit'>
          <a-button class='margin-btn' @click='resetFilter'>重置</a-button>
          <a-button type='primary' @click='handleFilter'>确定</a-button>
        </div>
      </div>
    </a-drawer>
    <!-- 完成modal -->
    <a-modal
      :bodyStyle="{ padding: '32px 32px 24px', boxSizing: 'border-box' }"
      :maskClosable='false'
      v-model='overVisible'
      :closable='false'
      on-ok='setLimit'
      width='460px'
    >
      <template slot='footer'>
        <a-button key='back' @click='overVisible = false'> 取消</a-button>
        <a-button key='submit' @click='sureOver' type='primary'> 确定</a-button>
      </template>
      <div class='modalTopBox'>
        <a-icon type='exclamation-circle' style='color: #faad14; font-size: 22px' />
        <span>请确定要完成此工单吗?</span>
      </div>
      <div class='bigFont'>
        当前工单已生产数量：{{ itemInfo.qualifiedNumEnd || 0 }}，计划生产数量：{{ itemInfo.planProduceNum || 0 }}
      </div>
    </a-modal>
    <!-- 批量modal——无法批量 -->
    <a-modal
      :bodyStyle="{ padding: '32px 32px 24px', boxSizing: 'border-box' }"
      :maskClosable='false'
      v-model='batchOverFiil'
      :closable='false'
      on-ok='setLimit'
      width='460px'
    >
      <template slot='footer'>
        <a-button key='back' @click='batchOverFiil = false'> 取消</a-button>
        <a-button key='submit' @click='batchOverFiil = false' type='primary'> 确定</a-button>
      </template>
      <div class='modalTopBox'>
        <a-icon type='close-circle' theme='filled' style='color: red; font-size: 22px' />
        <span>{{ actionType == 'batchOver' ? '无法批量完工' : '无法批量作废' }}</span>
      </div>
      <div class='smallFont'>{{ resInfo.message }}</div>
    </a-modal>
    <!-- 批量modal——可以批量 -->
    <a-modal
      :bodyStyle="{ padding: '32px 32px 24px', boxSizing: 'border-box' }"
      :maskClosable='false'
      v-model='batchOverSuccess'
      :closable='false'
      on-ok='setLimit'
      width='460px'
    >
      <template slot='footer'>
        <a-button key='back' @click='batchOverSuccess = false'> 取消</a-button>
        <a-button key='submit' @click='sureBatchOver' type='primary'> 确定</a-button>
      </template>
      <div class='modalTopBox'>
        <a-icon type='exclamation-circle' style='color: #faad14; font-size: 22px' />
        <span>{{ actionType == 'batchOver' ? '请确定要批量完成工单吗?' : '请确定要批量作废工单吗?' }}</span>
      </div>
      <div class='bigFont'>已选中{{ selectedRowKeys.length }}条工单记录</div>
      <div class='smallFont'>工单{{ actionType == 'batchOver' ? '完成' : '作废' }}后，无法领料、退料、补料、报工</div>
    </a-modal>
    <!-- 批量modal——批量开始 -->
    <a-modal
      :bodyStyle="{ padding: '32px 32px 24px', boxSizing: 'border-box' }"
      :maskClosable='false'
      v-model='batchStart'
      :closable='false'
      on-ok='setLimit'
      width='460px'
    >
      <template slot='footer'>
        <a-button key='back' @click='batchStart = false'> 取消</a-button>
        <a-button key='submit' @click='sureBatchStart' type='primary'> 确定</a-button>
      </template>
      <div class='modalTopBox'>
        <a-icon type='exclamation-circle' style='color: #faad14; font-size: 22px' />
        <span>请确定要批量开始工单吗</span>
      </div>
      <div class='bigFont'>已选中{{ selectedRowKeys.length }}条工单记录</div>
      <!-- <div class="smallFont">工单{{ actionType == 'batchOver' ? '完成' : '作废' }}后，无法领料、退料、补料、报工</div> -->
    </a-modal>
    <!-- 批量modal——无法开始 -->
    <a-modal
      :bodyStyle="{ padding: '32px 32px 24px', boxSizing: 'border-box' }"
      :maskClosable='false'
      v-model='batchStartFiil'
      :closable='false'
      on-ok='setLimit'
      width='460px'
    >
      <template slot='footer'>
        <a-button key='back' @click='batchStartFiil = false'> 取消</a-button>
        <a-button key='submit' @click='batchStartFiil = false' type='primary'> 确定</a-button>
      </template>
      <div class='modalTopBox'>
        <a-icon type='close-circle' theme='filled' style='color: red; font-size: 22px' />
        <span>无法批量开始</span>
      </div>
      <div class='smallFont'>{{ cantStartMsg }}</div>
    </a-modal>
    <windowForm ref='windowForm' @refresh='pubSearch(() => {})'></windowForm>
    <windowDetail ref='windowDetail'></windowDetail>
  </div>
</template>
<script>
import vueQr from 'vue-qr'
import moment from 'moment'
import {
  productOrderList,
  batchValidOrUpdateStatus,
  delConta,
  revocation,
  delContaAll,
  getOrderStatus
} from '@/api/productOrder'
import { columns, allColumn } from './allColumn.js'
import { getNewColumns, compareDate, subStrText, numFormat, objArrFilter } from '@/utils/util'
import SetColumn from '@/pubComponent/SetColumn.vue'
import crumbs from '@/components/crumbs.vue'
import dingPrintView from './print/dingPrintView.vue'
import dingProcessView from './print/dingProcessView.vue'
import { mapState } from 'vuex'
import workOrder from '@/views/workManagement/workOrder/print/workOrder'
import batchWorkOrder from '@/views/workManagement/workOrder/print/batchWorkOrder'
import batchDingPrintView from '@/views/workManagement/workOrder/print/batchDingPrintView'
import circulationCard from '@/views/workManagement/workOrder/print/circulationCard'
import PubExport from '@/components/pubBtn/PubExport.vue'
import tableDragResize from '@/mixins/tableDragResize'
import PubImport from '@/components/pubBtn/PubImport.vue'
import windowForm from './buildWorkOrder.vue'
import windowDetail from '@/views/workManagement/workOrder/workOrderDetail'
import { editForm } from '../../../api/productOrder'
import tableDynamicField from '@/mixins/tableDynamicField'
import { APILX } from '@/api/requestLx'
import { hasButton } from '@/utils/hasPermission'

const actionArr = [
  {
    fixed: 'right',
    title: '操作',
    align: 'left',
    dataIndex: 'actions',
    ellipsis: true,
    width: 114,
    scopedSlots: { customRender: 'actions' }
  }
]
export default {
  mixins: [tableDragResize, tableDynamicField],
  components: {
    vueQr,
    crumbs,
    SetColumn,
    workOrder,
    circulationCard,
    dingPrintView,
    dingProcessView,
    PubExport,
    PubImport,
    batchWorkOrder,
    batchDingPrintView,
    windowForm,
    windowDetail
  },

  data() {
    return {
      types: '1',
      allColumn,
      Controlsname: '',
      prinForm: {
        Controls: '',
        title: '',
        Controlsname: [],
        userid: '',
        Userlist: [],
        date: moment(new Date()).format('YYYY-MM-DD')
      },
      prinFormrulus: {
        title: [{ required: true, message: '请输入标题', trigger: 'blur' }]
      },
      row: {},
      prinvis: false,
      printvisible: false,
      batchPrintvisible: false,
      printType: true,
      printId: '',
      numFormat,
      moment,
      subStrText,
      columns,
      tableData: [],
      selectedRowKeys: [],
      overVisible: false,
      itemInfo: {},
      batchOverFiil: false,
      batchOverSuccess: false,
      batchStart: false,
      batchStartFiil: false,
      resInfo: {},
      cantStartMsg: '',
      actionType: '',
      //全选按钮
      listIndeterminate: false,
      listCheckAll: false,
      current: 1,
      total: 0,
      pageSize: 30,
      pageSizeOptions: ['10', '20', '30', '40', '50'],
      showSetColumn: false,

      // 抽屉数据
      showFilter: false, // 筛选抽屉
      modelStartTime: [],
      modelEndTime: [],
      modelCreateTime: [],
      showPrincipalStr: '',
      showCreateStr: '',
      principalStr: '',
      createStr: '',
      realFilterForm: {},
      tableFilterForm: {
        orderStatus: []
      },
      filterForm: {
        orderStatus: [],
        orderCode: '',
        serialName: '',
        serialNumber: '',
        serialSpecifications: '',
        planStartTime: [],
        planEndTime: [],
        updateBys: '',
        sellOrderCode: '',
        createBys: '',
        createTime: [],
        updateTime: []
      },
      filteredFormLable: {
        orderStatus: '生产状态',
        orderCode: '工单编号',
        serialName: '物品名称',
        serialNumber: '物品编号',
        serialSpecifications: '规格',
        planStartTime: '计划开始时间',
        planEndTime: '计划完成时间',
        updateBys: '更新人',
        sellOrderCode: '关联订单',
        createBys: '创建人',
        createTime: '创建时间',
        updateTime: '更新时间'
      },
      statusList: [],
      currentEnvironment: '',
      // 导出参数
      exportUrl: '/produceorder/produceOrderInfo/exportXls',
      chooseArr: [],
      sortForm: {},
      allRequestList: [],
      fullName: `生产工单 ${moment(new Date()).format('YYYY-MM-DD HH:mm')}`,
      tableKey: 1.9,
      cancelbtn: true,
      formType: 3,
      actionArr,
      EntityName: this.BUSI_CONST.Entity.WORK_ORDER_LIST
    }
  },
  computed: {
    ...mapState({
      collapsed: (state) => state.user.collapsedAno
    }),
    computedX() {
      let xnum = 0
      for (let item of this.columns) {
        xnum += Number(item.width) || 0
      }

      return xnum
    },
    realFilterNum() {
      let nums = 0
      for (let key in this.realFilterForm) {
        if (this.realFilterForm[key] != '') {
          nums += 1
        }
      }
      return nums
    },
    filteredNums() {
      let nums = 0
      for (let key in this.filterForm) {
        if (this.filterForm[key] != '') {
          nums += 1
        }
      }
      return nums
    },
    filteredList() {
      let list = []
      for (let key in this.filterForm) {
        console.log(this.filteredFormLable[key])
        if (this.filteredFormLable[key] == '生产状态') {
          let strArr = ''
          for (let item of this.filterForm[key]) {
            for (let each of this.statusList) {
              if (item == each.value) {
                strArr += each.label + '，'
              }
            }
          }
          if (strArr) {
            strArr = strArr.substring(0, strArr.length - 1)
          }
          list.push({
            title: this.filteredFormLable[key],
            text: strArr,
            key
          })
        } else if (this.filteredFormLable[key] == '更新人') {
          list.push({
            title: this.filteredFormLable[key],
            text: this.showPrincipalStr,
            key
          })
        } else if (this.filteredFormLable[key] == '创建人') {
          list.push({
            title: this.filteredFormLable[key],
            text: this.showCreateStr,
            key
          })
        } else {
          list.push({
            title: this.filteredFormLable[key],
            text: this.filterForm[key],
            key
          })
        }
      }
      return list
    }
  },
  created() {
    this.getData()
    this.judgeEn()
    this.ProcessesList()
    this.getFieldsLable()
  },
  methods: {
    progressFormat(_, a, b) {
      if (b === 0) {
        return 'X'
      }
      return `${Math.floor((a / b) * 100)}%`
    },
    hasButton,
    async getFieldsLable() {
      let res = await APILX.formTypeExtendedFieldList({ formType: this.formType })
      if (res.code == 200 && res.result) {
        let formTypeExtendedFields = res.result || []

        formTypeExtendedFields.forEach((fields) => {
          this.filteredFormLable['extDataJson.' + fields.fieldKey] = fields.fieldName
          this.filterForm['extDataJson.' + fields.fieldKey] = ''
        })
      }
    },
    ProcessesList() {
      getOrderStatus().then((res) => {
        if (res.code == 200) {
          this.statusList = res.result.map((el) => {
            return {
              value: el.value,
              label: el.text
            }
          })
          this.getData()
        }
      })
    },
    checkStatus(value) {
      console.log(value, '8888')
      if (value * 1 === 0) {
        return '#DFDFDF'
      } else if (value * 1 > 0 && value < 100) {
        return '#1890FF'
      } else if (value * 1 == 100) {
        return '#00B042'
      } else if (value * 1 > 100) {
        return '#ff1e10'
      }
    },
    ControlsFun(storeVals, row) {
      this.prinForm.Controls = ''
      this.Controlsname = ''
      let newArr = []
      let arrTwo = []
      let Userlist = []
      for (let item of row) {
        newArr.push(item.id)
        arrTwo.push(item.realname)
        Userlist.push({
          userid: item.id,
          realname: item.realname
        })
      }
      this.prinForm.Userlist = Userlist
      // 推入清楚的id
      this.prinForm.Userlist.push({
        userid: 'userClear',
        realname: '清除'
      })
      if (newArr.length > 0) {
        this.prinForm.Controls = newArr.join(',')
      }
      if (arrTwo.length > 0) {
        this.prinForm.Controlsname = arrTwo
        this.Controlsname = arrTwo.join(',')
      }
      console.log(this.prinForm)
    },
    delord() {
      let that = this
      that.$antdConfirm({
        title: '确定批量删除工单吗？',
        content: '工单删除后，将同时删除关联的任务和报工记录，删除后不可恢复',
        iconType: 'exclamation-circle',
        onOk: () => {
          delContaAll({ ids: this.selectedRowKeys.join(',') }).then((res) => {
            if (res.code == 200) {
              that.$antdMessage.success('删除成功')

              that.getData()
            } else {
              that.$antdMessage.error(res.message)
            }
          })
        }
      })
    },
    chehuiAction() {
      for (let i = 0; i < this.chooseArr.length; i++) {
        const item = this.chooseArr[i]
        if (item.orderStatus == '0') {
          // this.cantStartMsg = `工单号状态不对,无法开始`
          this.cantStartMsg = `${item.orderCode}状态不对无法撤回`
          this.batchStartFiil = true
          return
        }
      }
      let that = this
      console.log(this.chooseArr)
      let data = this.chooseArr.map((el) => {
        return {
          orderId: el.id,
          orderStatus: el.orderStatus
        }
      })
      that.$antdConfirm({
        title: '确定批量撤回工单吗？',
        content: `只有生产状态为“生产中”、“已完成”、“已取消”的生产工单才能撤回成功。`,
        iconType: 'exclamation-circle',
        onOk: () => {
          revocation(data).then((res) => {
            console.log(res, 'res')
            if (res.code == 200) {
              that.$antdMessage.success(res.message)

              that.getData()
              this.selectedRowKeys = []
              this.checkBoxStatus()
            } else {
              that.$antdMessage.error(res.message)
            }
          })
        }
      })
    },

    quxiaoAction() {
      if (this.selectedRowKeys.length > 0) {
        for (let i = 0; i < this.chooseArr.length; i++) {
          const item = this.chooseArr[i]
          if (item.orderStatus == '1' && item.orderStatus == '0') {
            // this.cantStartMsg = `工单号状态不对,无法开始`
            this.cantStartMsg = `${item.orderCode}状态不对无法开始`
            this.batchStartFiil = true
            return
          }
        }
        let that = this
        that.$antdConfirm({
          title: '确定批量取消工单吗？',
          content: '工单取消后，取消后不可恢复',
          iconType: 'exclamation-circle',
          onOk: () => {
            batchValidOrUpdateStatus({ ids: this.selectedRowKeys.join(','), orderStatus: '3', type: '取消' }).then(
              (res) => {
                if (res.code == 200) {
                  that.$antdMessage.success(res.message)

                  that.getData()
                  this.selectedRowKeys = []
                  this.checkBoxStatus()
                } else {
                  that.$antdMessage.error(res.message)
                }
              }
            )
          }
        })
      } else {
        this.$antdMessage.warning('请先选择数据')
      }
    },
    delconta(id) {
      let that = this
      that.$antdConfirm({
        title: '确定删除工单吗？',
        // content: '工单删除后，将同时删除关联的任务和报工记录，删除后不可恢复',
        iconType: 'exclamation-circle',
        onOk: () => {
          delContaAll({ ids: id }).then((res) => {
            if (res.code == 200) {
              that.$antdMessage.success('删除成功')
              that.getData()
            } else {
              that.$antdMessage.error(res.message)
            }
          })
        }
      })
    },

    updateParentData() {
      let params = this.formatData()
      this.current = 1
      let obj = {
        pageNo: this.current,
        pageSize: this.pageSize,
        ...params
      }
      this.getData()
    },
    judgeEn() {
      this.currentEnvironment = sessionStorage.getItem('currentEnvironment')
      if (this.currentEnvironment) {
        if (this.timer) {
          clearInterval(this.timer)
          this.timer = null
        }
      } else {
        this.timer = setTimeout(() => {
          this.judgeEn()
        }, 100)
      }
    },
    printIt(a, b) {
      if (!b) {
        let obj = {
          id: a.id,
          code: a.orderCode
        }
        this.$router.push({
          path: '/workOrderList/printOutCard',
          query: { obj: JSON.stringify(obj) }
        })
        return
      }
      this.types = '1'
      this.row = a
      this.printType = b
      this.printvisible = true
    },
    changePrint() {
      this.printvisible = false
    },
    changeBatchPrint() {
      this.batchPrintvisible = false
    },
    checkColor(row) {
      let colorStr = ''
      // console.log('当前数据：', row.planEndTime)
      if (row.status == 'notStarted' || row.status == 'inProduction') {
        let currentTime = new Date(+new Date() + 8 * 3600 * 1000).toJSON().substr(0, 19).replace('T', ' ')
        let checkResult = compareDate(row.planEndTime, currentTime)
        if (checkResult) {
          colorStr = ''
        } else {
          colorStr = '#ff4d4f'
        }
      } else {
        colorStr = ''
      }
      return colorStr
    },

    openDetail(row) {
      this.$refs.windowDetail.initDetail(row)
    },
    // 批量完成
    batchAction(actionType) {
      if (this.selectedRowKeys.length > 0) {
        console.log(this.chooseArr)
        for (let i = 0; i < this.chooseArr.length; i++) {
          const item = this.chooseArr[i]
          if (item.orderStatus != '1') {
            // this.cantStartMsg = `工单号状态不对,无法开始`
            this.cantStartMsg = `${item.orderCode}状态不对无法开始`
            this.batchStartFiil = true
            return
          }
        }

        let that = this
        that.$antdConfirm({
          title: '确定批量完成工单吗？',
          content: '只有生产状态为“生产中”的生产工单才能完成成功，工单完成后无法报工',
          iconType: 'exclamation-circle',
          onOk: () => {
            let obj = {
              ids: that.selectedRowKeys.join(','),
              orderStatus: '2',
              type: '完成'
            }
            batchValidOrUpdateStatus(obj).then((res) => {
              if (res.code == 200) {
                that.$antdMessage.success(res.message)
                that.getData()
                this.selectedRowKeys = []
                this.checkBoxStatus()
              } else {
                that.$antdMessage.error(res.message)
              }
            })
          }
        })
      } else {
        this.$antdMessage.warning('请先选择数据')
      }
    },
    // 批量打印
    batchPrintAction() {
      this.batchPrintvisible = true
    },
    // 批量开始
    batchStartAction() {
      if (this.selectedRowKeys.length > 0) {
        console.log(this.chooseArr)
        for (let i = 0; i < this.chooseArr.length; i++) {
          const item = this.chooseArr[i]
          if (item.orderStatus != '0') {
            // this.cantStartMsg = `工单号状态不对,无法开始`
            this.cantStartMsg = `${item.orderCode}状态不对无法开始`
            this.batchStartFiil = true
            return
          }
        }

        let that = this
        that.$antdConfirm({
          title: '确定批量开始工单吗？',
          content: '只有生产状态为“未开始”的生产工单才能开始成功',
          iconType: 'exclamation-circle',
          onOk: () => {
            let obj = {
              ids: that.selectedRowKeys.join(','),
              orderStatus: '1',
              type: '开始'
            }
            batchValidOrUpdateStatus(obj).then((res) => {
              if (res.code == 200) {
                that.$antdMessage.success(res.message)
                that.getData()
                this.selectedRowKeys = []
                this.checkBoxStatus()
              } else {
                that.$antdMessage.error(res.message)
              }
            })
          }
        })
      } else {
        this.$antdMessage.warning('请先选择数据')
      }
    },
    sureBatchOver() {
      let obj = {
        ids: this.selectedRowKeys.join(','),
        status: this.actionType == 'batchOver' ? 'completed' : 'abolished',
        updateFlag: true
      }
      batchValidOrUpdateStatus(obj).then((res) => {
        if (res.success) {
          let params = this.formatData()
          this.current = 1
          let obj = {
            pageNo: this.current,
            pageSize: this.pageSize,
            ...params
          }
          this.getData()
          this.selectedRowKeys = []
          this.checkBoxStatus()
          this.$antdMessage.success(this.actionType == 'batchOver' ? '批量完工成功!' : '批量作废成功!')
        } else {
          this.$antdMessage.warning(res.message)
        }
        this.batchOverSuccess = false
      })
    },
    // 批量开始
    sureBatchStart() {
      let obj = {
        ids: this.selectedRowKeys.join(','),
        orderStatus: '1'
      }
      batchValidOrUpdateStatus(obj).then((res) => {
        if (res.success) {
          this.batchStart = false
          this.current = 1
          let params = this.formatData()
          let obj = {
            pageNo: this.current,
            pageSize: this.pageSize,
            ...params
          }
          this.getData()
          this.selectedRowKeys = []
          this.checkBoxStatus()
          this.$antdMessage.success('开始成功！')
        } else {
          this.$antdMessage.warning(res.message)
        }
      })
    },
    //操作——完成
    overItem(row) {
      let that = this
      that.$antdConfirm({
        title: '确定完成工单吗？',
        content: '只有生产状态为“生产中”的生产工单才能完成成功，工单完成后无法报工',
        iconType: 'exclamation-circle',
        onOk: () => {
          let obj = {
            ids: row.id,
            orderStatus: '2'
          }
          batchValidOrUpdateStatus(obj).then((res) => {
            if (res.code == 200) {
              that.$antdMessage.success('完成成功')
              that.getData()
              this.selectedRowKeys = []
              this.checkBoxStatus()
            } else {
              that.$antdMessage.error(res.message)
            }
          })
        }
      })
    },
    sureOver() {
      let obj = {
        ids: this.itemInfo.id,
        status: 'completed',
        updateFlag: true
      }
      batchValidOrUpdateStatus(obj).then((res) => {
        if (res.success) {
          let params = this.formatData()
          this.current = 1
          let obj = {
            pageNo: this.current,
            pageSize: this.pageSize,
            ...params
          }
          this.getData()
          this.$antdMessage.success('完成成功！')
        } else {
          this.$antdMessage.warning(res.message)
        }
        this.overVisible = false
      })
    },
    //操作——作废
    cancellation(row) {
      let that = this
      that.$antdConfirm({
        title: '请确定要撤回此工单吗?',
        content: '撤回后此工单将回到最初状态',
        iconType: 'exclamation-circle',
        onOk: () => {
          let obj = [{ orderId: row.id, orderStatus: row.orderStatus }]
          if (that.cancelbtn) {
            that.cancelbtn = false
            revocation(obj).then((res) => {
              if (res.success) {
                let params = that.formatData()
                let obj = {
                  pageNo: that.current,
                  pageSize: that.pageSize,
                  ...params
                }
                that.getData()
                that.$antdMessage.success('撤回成功！')
              } else {
                that.$antdMessage.warning(res.message)
              }
              that.cancelbtn = true
            })
          }
        }
      })
    },
    // 操作——开始
    confirmStart(row) {
      let obj = {
        ids: row.id,
        orderStatus: '1'
      }
      batchValidOrUpdateStatus(obj).then((res) => {
        if (res.success) {
          this.batchStart = false
          this.current = 1
          let params = this.formatData()
          let obj = {
            pageNo: this.current,
            pageSize: this.pageSize,
            ...params
          }
          this.getData()
          this.selectedRowKeys = []
          this.checkBoxStatus()
          this.$antdMessage.success('开始成功！')
        } else {
          this.$antdMessage.warning(res.message)
        }
      })
    },
    // 取消——开始
    cancelord(row) {
      console.log(row)
      this.$antdConfirm({
        title: '确定取消工单吗?',
        content: '取消后，工单状态变更为“已取消”，工单将不允许报工。',
        iconType: 'exclamation-circle',
        onOk: () => {
          let obj = {
            ids: row.id,
            orderStatus: '3'
          }
          batchValidOrUpdateStatus(obj).then((res) => {
            if (res.success) {
              this.batchStart = false
              this.current = 1
              let params = this.formatData()
              let obj = {
                pageNo: this.current,
                pageSize: this.pageSize,
                ...params
              }
              this.getData()
              this.selectedRowKeys = []
              this.checkBoxStatus()
              this.$antdMessage.success('取消成功！')
            } else {
              this.$antdMessage.warning(res.message)
            }
          })
        }
      })
    },
    // filterNumChang (value) {
    //   this.filteredNums = value
    // },
    getData(secondParams) {
      let params = this.formatData()
      let obj = {
        pageNo: this.current,
        pageSize: this.pageSize,
        ...params,
        ...this.sortForm
      }
      productOrderList(obj).then((res) => {
        if (res.success) {
          if (res.result.total) {
            this.total = res.result.total
          } else {
            this.total = 0
          }
          console.log(res)
          let copyArr = JSON.parse(JSON.stringify(res.result.records))
          // for (let item of copyArr) {
          //   for (let each in item) {
          //     if (!item[each] && item[each] != 0) {
          //       item[each] = '-'
          //     }
          //   }
          // }
          this.tableData = copyArr
          this.tableData.forEach(item => {
            if (item.produceOrderTaskVo && item.produceOrderTaskVo.length) {
              item.produceOrderTaskVo.forEach(el => {
                el.percent = (el.qualifiedNum / el.planProduceNum)
                if (!el.planProduceNum || isNaN(el.qualifiedNum / el.planProduceNum)) {
                  el.percent = 0
                }
              })
            }

          })
          this.selectedRowKeys = []
          this.checkBoxStatus()
          if (secondParams) {
            this.checkBoxStatus()
          }
        } else {
          this.$antdMessage.warning(res.message)
        }
      })
    },

    /* 打开筛选 */
    handleShowFilter() {
      // this.filterForm = JSON.parse(JSON.stringify(this.realFilterForm))
      this.showFilter = true
    },
    editForm(data) {
      data.copy = false
      this.$refs.windowForm.initForm(data)
    },
    copyForm(data) {
      data.copy = true
      this.$refs.windowForm.initForm(data)
    },
    newBuild() {
      this.$refs.windowForm.initForm()
      // this.$router.push({
      //   path: '/buildWorkOrder',
      // })
    },
    showColumn() {
      this.showSetColumn = true
      this.$nextTick(() => {
        this.$refs.SetColumn.paramsData(this.allColumn, this.BUSI_CONST.Entity.WORK_ORDER_LIST, columns)
      })
    },
    sureBtn(emitArr) {
      this.columns = getNewColumns(this.allColumn, emitArr, actionArr)
      localStorage.setItem(this.BUSI_CONST.Entity.WORK_ORDER_LIST, JSON.stringify(emitArr))
      this.tableKey += 1
      console.log('返回的数据是：', this.columns)
    },
    checkPlaceholder(dataIndex) {
      let str = ''
      switch (dataIndex) {
        case 'orderCode':
          str = '请输入工单编号'
          break
        case 'goodsName':
          str = '请输入产品名称'
          break
        case 'sellOrderCode':
          str = '请输入关联订单'
          break
        case 'orderStatus':
          str = '请选择生产状态'
          break
        case 'goodsSpec':
          str = '请输入规格'
          break
      }
      return str
    },
    pubSearch(confirm, dataIndex, clearFilters) {
      this.current = 1
      confirm() //用来关闭搜索弹窗
      // clearFilters() //用来重置搜索内容
      // console.log('这都是啥11：', confirm)
      console.log('这都是啥22：', dataIndex)
      // this.filterForm = JSON.parse(JSON.stringify(this.tableFilterForm))
      // this.realFilterForm = JSON.parse(JSON.stringify(this.tableFilterForm))
      let params = this.formatData()
      let obj = {
        pageNo: this.current,
        pageSize: this.pageSize,
        ...params
      }
      this.getData()
      // console.log('这都是啥33：', clearFilters)
    },
    // table
    tableChange(pagination, filters, sorter, { currentDataSource }) {
      console.log('看看这是啥33：', sorter)
      this.current = 1
      let params = this.formatData()
      if (sorter.order) {
        let sortType = ''
        if (sorter.order == 'ascend') {
          sortType = 'ASC'
        } else {
          sortType = 'DESC'
        }
        if (sorter.columnKey == 'createTime') {
          sorter.columnKey = 'create_time'
        }
        if (sorter.columnKey == 'updateTime') {
          sorter.columnKey = 'update_time'
        }
        let obj = {
          pageNo: this.current,
          pageSize: this.pageSize,
          ...params,
          sortType: sortType,
          sortColumn: sorter.columnKey
        }
        this.sortForm = {
          sortType: sortType,
          sortColumn: sorter.columnKey
        }
        this.getData()
      } else {
        this.sortForm = {}
        let obj = {
          pageNo: this.current,
          pageSize: this.pageSize,
          ...params
        }
        this.getData()
      }
    },
    onSelectChange(selectedRowKeys, selectedRows) {
      // console.log('第一个参数是；', selectedRowKeys)
      // console.log('第second个参数是；', selectedRows)
      this.selectedRowKeys = selectedRowKeys
      console.log(selectedRows, 'selectedRows')
      this.chooseArr = []
      for (let tag of selectedRowKeys) {
        for (let item of this.tableData) {
          if (tag == item.id) {
            this.chooseArr.push(item)
          }
        }
      }
      console.log('chooseArr', this.chooseArr)
      this.checkBoxStatus()
    },
    checkBoxStatus() {
      if (this.selectedRowKeys.length == 0) {
        this.listIndeterminate = false
        this.listCheckAll = false
      } else {
        let tableIds = []
        for (let item of this.tableData) {
          tableIds.push(item.id)
        }
        let checkValue = this.isInclude(tableIds, this.selectedRowKeys)
        console.log()
        console.log('第一个参数是；', checkValue)
        if (checkValue) {
          this.listIndeterminate = false
          this.listCheckAll = true
        } else {
          this.listIndeterminate = true
          this.listCheckAll = false
        }
      }
    },
    isInclude(aa, bb) {
      return aa.every((item) => {
        return bb.some((sub) => {
          return sub === item
        })
      })
    },
    // 全选
    onCheckAllChange(e) {
      console.log('zhehsig', e.target)
      if (e.target.checked) {
        for (let item of this.tableData) {
          this.selectedRowKeys = this.selectedRowKeys.filter((each) => {
            return each != item.id
          })
          this.chooseArr = this.chooseArr.filter((every) => {
            return every.id != item.id
          })
          this.selectedRowKeys.push(item.id)
          this.chooseArr.push(item)
        }
      } else {
        for (let item of this.tableData) {
          this.selectedRowKeys = this.selectedRowKeys.filter((each) => {
            return each != item.id
          })
          this.chooseArr = this.chooseArr.filter((every) => {
            return every.id != item.id
          })
        }
      }
      this.checkBoxStatus()
    },
    clearArr() {
      this.selectedRowKeys = []
      this.chooseArr = []
      this.checkBoxStatus()
    },
    // 分页
    onChangePage(current, pageSize) {
      this.current = current
      let params = this.formatData()
      let obj = {
        pageNo: this.current,
        pageSize: this.pageSize,
        ...params
      }
      let secondParams = true
      this.getData(secondParams)
    },
    onShowSizeChange(current, pageSize) {
      this.pageSize = pageSize
      let params = this.formatData()
      let obj = {
        pageNo: this.current,
        pageSize: this.pageSize,
        ...params
      }
      let secondParams = true
      this.getData(secondParams)
    },
    userPrinc(storeVals, row) {
      this.current = 1
      console.log('这里限制性了')
      let newArr = []
      let arrTwo = []
      for (let item of row) {
        newArr.push(item.id)
        arrTwo.push(item.realname)
      }
      if (newArr.length > 0) {
        this.filterForm.updateBys = newArr.join(',')
      } else {
        this.filterForm.updateBys = ''
      }
      if (arrTwo.length > 0) {
        this.showPrincipalStr = arrTwo.join(',')
      } else {
        this.showPrincipalStr = ''
      }
      // this.filterForm = JSON.parse(JSON.stringify(this.tableFilterForm))
      // this.realFilterForm = JSON.parse(JSON.stringify(this.tableFilterForm))

      this.getData()
    },
    handleSearch(confirm, dataIndex, clearFilters) {
      confirm() //用来关闭搜索弹窗
      let params = this.formatData()
      this.current = 1
      let obj = {
        pageNo: this.current,
        pageSize: this.pageSize,
        ...params
      }
      this.getData()
    },
    userCreate(storeVals, row) {
      this.current = 1
      let newArr = []
      let arrTwo = []
      for (let item of row) {
        newArr.push(item.id)
        arrTwo.push(item.realname)
      }
      if (newArr.length > 0) {
        this.filterForm.createBys = newArr.join(',')
      } else {
        this.filterForm.createBys = ''
      }
      if (arrTwo.length > 0) {
        this.showCreateStr = arrTwo.join(',')
      } else {
        this.showCreateStr = ''
      }
      // this.filterForm = JSON.parse(JSON.stringify(this.tableFilterForm))
      // this.realFilterForm = JSON.parse(JSON.stringify(this.tableFilterForm))
      let params = this.formatData()
      let obj = {
        pageNo: this.current,
        pageSize: this.pageSize,
        ...params
      }
      this.getData()
    },
    principalChange(storeVals, row) {
      let newStr = ''
      if (row.length > 0) {
        let newArr = []
        let arrTwo = []
        for (let item of row) {
          newArr.push(item.id)
          arrTwo.push(item.realname)
        }
        if (newArr.length > 0) {
          newStr = newArr.join(',')
        }
        if (arrTwo.length > 0) {
          this.showPrincipalStr = arrTwo.join(',')
        }
      } else {
        newStr = ''
        this.showPrincipalStr = ''
      }
      this.$set(this.filterForm, 'updateBys', newStr)
    },
    createChange(storeVals, row) {
      let newStr = ''
      if (row.length > 0) {
        let newArr = []
        let arrTwo = []
        for (let item of row) {
          newArr.push(item.id)
          arrTwo.push(item.realname)
        }
        if (newArr.length > 0) {
          newStr = newArr.join(',')
        }
        if (arrTwo.length > 0) {
          this.showCreateStr = arrTwo.join(',')
        }
      } else {
        newStr = ''
        this.showCreateStr = ''
      }
      this.$set(this.filterForm, 'createBys', newStr)
    },
    startTimeChange(a, b) {
      if (!b[0] && !b[1]) {
        this.modelStartTime = []
        this.filterForm.planStartTime = []
      } else {
        this.filterForm.planStartTime = b
      }
    },
    endTimeChange(a, b) {
      if (!b[0] && !b[1]) {
        this.modelEndTime = []
        this.filterForm.planEndTime = []
      } else {
        this.filterForm.planEndTime = b
      }
    },
    timeCreateChange(a, b) {
      if (!b[0] && !b[1]) {
        this.modelCreateTime = []
        this.filterForm.createTime = []
      } else {
        this.filterForm.createTime = b
      }
    },
    uptime(a, b) {
      if (!b[0] && !b[1]) {
        this.filterForm.updateTime = []
      } else {
        this.filterForm.updateTime = b
      }
    },
    showDrawer() {
      this.showFilter = true
    },
    /* 确定筛选 */
    handleFilter() {
      console.log('当前选择的是：', this.filterForm)
      let params = this.formatData()
      this.current = 1
      let obj = {
        pageNo: this.current,
        pageSize: this.pageSize,
        ...params
      }
      this.getData()
      this.realFilterForm = JSON.parse(JSON.stringify(this.filterForm))
      this.tableFilterForm = JSON.parse(JSON.stringify(this.filterForm))
      this.showFilter = false
    },
    // 筛选传参数据
    formatData() {
      let copyForm = JSON.parse(JSON.stringify(this.filterForm))

      let params = {
        ...copyForm
      }

      if (copyForm.orderStatus && copyForm.orderStatus.length > 0) {
        params.orderStatus = copyForm.orderStatus.join(',')
      } else {
        params.orderStatus = ''
      }
      // params.orderCode = copyForm.orderCode
      // params.serialName = copyForm.serialName
      // params.serialNumber = copyForm.serialNumber
      // params.serialSpecifications = copyForm.serialSpecifications
      if (copyForm.planStartTime && copyForm.planStartTime.length > 0) {
        params.startPlanStartTime = copyForm.planStartTime[0] + ' ' + '00:00:00'
        params.endPlanStartTime = copyForm.planStartTime[1] + ' ' + '23:59:59'
      } else {
        params.startPlanStartTime = ''
        params.endPlanStartTime = ''
      }
      if (copyForm.planEndTime && copyForm.planEndTime.length > 0) {
        params.startPlanEndTime = copyForm.planEndTime[0] + ' ' + '00:00:00'
        params.endPlanEndTime = copyForm.planEndTime[1] + ' ' + '23:59:59'
      } else {
        params.planEndTimeBegin = ''
        params.planEndTimeEnd = ''
      }
      if (copyForm.createTime && copyForm.createTime.length > 0) {
        params.createTimeBegin = copyForm.createTime[0] + ' ' + '00:00:00'
        params.createTimeEnd = copyForm.createTime[1] + ' ' + '23:59:59'
      } else {
        params.createTimeBegin = ''
        params.createTimeEnd = ''
      }
      if (copyForm.updateTime && copyForm.updateTime.length > 0) {
        params.updateTimeBegin = copyForm.updateTime[0] + ' ' + '00:00:00'
        params.updateTimeEnd = copyForm.updateTime[1] + ' ' + '23:59:59'
      } else {
        params.updateTimeBegin = ''
        params.updateTimeEnd = ''
      }

      params.extDataJson = {}
      for (const key in params) {
        if (Object.hasOwnProperty.call(params, key)) {
          const value = params[key]
          let keys = key.split('.')
          if (keys.length > 1) {
            // debugger
            params[keys[0]][keys[1]] = value
            // if (params[key[0]]) {
            //   params[keys[0]][keys[1]] = value
            // } else {
            //   // params[keys[0]] = {}
            //   params[keys[0]][keys[1]] = value
            // }
          }
        }
      }

      delete params.createTime
      delete params.planEndTime
      delete params.planStartTime
      delete params.updateTime
      // params.updateBys = copyForm.updateBys
      // params.sellOrderCode = copyForm.sellOrderCode
      // params.createBys = copyForm.createBys

      return params
    },
    /* 删除已选 */
    delFiltered(key) {
      if (this.filteredFormLable[key] == '生产状态') {
        this.filterForm[key] = []
      } else if (this.filteredFormLable[key] == '计划开始时间') {
        this.modelStartTime = []
        this.filterForm[key] = []
      } else if (this.filteredFormLable[key] == '计划完成时间') {
        this.modelEndTime = []
        this.filterForm[key] = []
      } else if (this.filteredFormLable[key] == '负责人') {
        this.principalStr = ''
        this.showPrincipalStr = ''
        this.filterForm[key] = ''
      } else if (this.filteredFormLable[key] == '创建人') {
        this.createStr = ''
        this.showCreateStr = ''
        this.filterForm[key] = ''
      } else if (this.filteredFormLable[key] == '更新人') {
        this.showPrincipalStr = ''
        this.principalStr = ''
        this.filterForm.updateBys = ''
      } else if (this.filteredFormLable[key] == '创建时间') {
        this.modelCreateTime = []
        this.filterForm[key] = []
      } else {
        this.filterForm[key] = ''
      }
    },
    /* 重置筛选 */
    resetFilter() {
      this.filterForm = {
        orderStatus: [],
        orderCode: '',
        goodsName: '',
        goodsSpec: '',
        planStartTime: [],
        planEndTime: [],
        principalIds: '',
        sellOrderCode: '',
        createByIds: '',
        createTime: [],
        updateTime: []
      }
      this.modelStartTime = []
      this.modelEndTime = []
      this.principalStr = ''
      this.showPrincipalStr = ''
      this.createStr = ''
      this.showCreateStr = ''
      this.modelCreateTime = []
    },
    /* 关闭筛选 */
    closeFilter() {
      this.showFilter = false
    },
    checkShow(item) {
      let currentBoolean = Array.isArray(item)
      if (currentBoolean) {
        if (item.length == 0) {
          return false
        } else {
          return true
        }
      } else {
        if (item) {
          return true
        } else {
          return false
        }
      }
    }
  }
}
</script>
<style scoped lang='less'>
@import '~@/assets/less/public.less';

/deep/.ant-progress-text {
   color: #333 !important;
 }

.flex(@jc, @ai, @fd: row) {
  display: flex;
  justify-content: @jc;
  align-items: @ai;
  flex-direction: @fd;
}

.table-operations {
  margin-bottom: 16px;
}

.table-operations > button {
  margin-right: 8px;
}

.topBox {
  .flex(space-between, center);
  margin-bottom: 16px;
}

.searchWorkOreder {
  .flex(flex-start, center);
  padding: 8px;
}

.pubColor {
  font-size: 14px;
  color: #1890ff;
  cursor: pointer;
  margin: 0 12px;
}

.pagebox {
  /deep/ .ant-card-body {
    height: calc(100vh - 174px);
    overflow: hidden;
    padding: 20px 16px;
  }
}

.filter-tit {
  background: #fff;
  border-bottom: 1px solid @greyBorder;
  font-size: @fontSize4;
}

.filter-num {
  color: @normalFont;
}

.filter-body {
  height: 100vh;
  display: flex;
  flex-direction: column;
}

.margin-btn {
  margin-right: @distance5;
}

.filter-tag {
  display: inline-block;
  position: relative;
  padding: 8px 10px;
  border-radius: 4px;
  font-size: @fontSize1;
  line-height: @fontSize1;
  max-width: 100%;
  background: @greyBg;
  color: @titFont;
  cursor: pointer;

  .tag-text {
    display: inline-block;
    padding-right: 20px;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .anticon-close {
    position: absolute;
    right: 8px;
    top: 8px;
  }
}

.tag-wrap {
  margin: 10px 0 0 10px;
}

.searchWorkOreder {
  .flex(flex-start, center);
  padding: 8px;
}

.modalTopBox {
  .flex(flex-start, center);
  margin-bottom: 8px;

  span {
    margin-left: 16px;
    display: block;
    overflow: hidden;
    color: rgba(0, 0, 0, 0.85);
    font-weight: 500;
    font-size: 16px;
    line-height: 1.4;
  }
}

.bigFont {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.78);
  box-sizing: border-box;
  padding-left: 12px;
  margin-bottom: 8px;
  font-weight: 600;
}

.smallFont {
  font-size: 14px;
  box-sizing: border-box;
  padding-left: 12px;
}

.right-btn {
  float: right;
  display: flex;
  justify-content: flex-end;
}

.tagContian {
  background: #fff;
  display: flex;
  justify-content: start;
  flex-wrap: wrap;
  padding: 10px 20px;
}
</style>